@CHARSET "UTF-8";
/*
    Background, border, shadow, title link hover : #73C5E5
    Title, title link: #006699
    link in pannel : #990019
    menu-horizon: from #5aa610 to #88c134 #c5ea9d
    menu-horizon hover: #88c134 #c5ea9d
*/

html, body
{
    height         : 100%;
    margin         : 0;
    padding        : 0;
    border         : 0;
    outline        : 0;
    font-size      : 100%;
    vertical-align : baseline;
    background     : transparent;
}

body {
    margin      : 0px 0px 0px 0px;
    min-width   : 960px;
    font-style  : normal;
    font-size   : 12px;
    font-family : Tahoma, Arial, Verdana, sans-serif;
    line-height : 16px;
    color       : black;
    background  : white;
    width       : 100%;
}

a {
    text-decoration : none;
    color           : #e74c32;
}

a:HOVER {
    text-decoration : underline;
    color           : #353d53;
}

p, div {
    margin  : 0px;
    padding : 0px;
    width   : 100%;
    display : block;
}

p.error_message {
    color       : red;
    font-size   : 16px;
    font-weight : bold;
}

.title {
    color       : #e74c32;
    font-weight : bold;
    font-size   : 16px;
}

/* Containers
----------------------------------------------------------------------------------------------------*/
.container_960 {
    display      : table;
    min-height   : 100%;
    margin       : 0px 0px 0px 0px;
    padding      : 0px 0px 0px 0px;
    margin-left  : auto;
    margin-right : auto;
    width        : 960px;

}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/
.grid_72,
.grid_152,
.grid_232,
.grid_312,
.grid_392,
.grid_472,
.grid_552,
.grid_632,
.grid_712,
.grid_792,
.grid_872,
.grid_952 {
    display      :inline;
    float        : left;
    position     : relative;
    margin-left  : 4px;
    margin-right : 4px;
}

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_960 .grid_72 {
    width:72px;
}

.container_960 .grid_152 {
    width:152px;
}

.container_960 .grid_232 {
    width:232px;
}

.container_960 .grid_312 {
    width:312px;
}

.container_960 .grid_392 {
    width:392px;
}

.container_960 .grid_472 {
    width:472px;
}

.container_960 .grid_552 {
    width:552px;
}

.container_960 .grid_632 {
    width:632px;
}

.container_960 .grid_712 {
    width:712px;
}

.container_960 .grid_792 {
    width:792px;
}

.container_960 .grid_872 {
    width:872px;
}

.container_960 .grid_952 {
    width:952px;
}

.clear {
    clear: both;

    /*Hack IE 7*/
    *width: auto;
}


/** Input Element ==================================
 * Coomon CSS of Input in website
 *
 * ==========================================*/
.text_box,
.combo_box,
.text_area {
    margin      : 0px;
    border      : 1px solid #353d53;
    padding     : 3px;
    line-height : 16px;
}

.button_input {
    margin      : 0px;
    padding     : 2px 10px;
    line-height : 16px;
}

.combo_box {
    height : 24px;
}

.check_box {
    margin  : 0px;
    padding : 0px;
}

.text_area {
    resize : vertical;
}

.icon_button {
    font-size      : 20px;
    color          : black;
    vertical-align : middle;
    cursor         : pointer;
}

.icon_button:HOVER {
    color : red;
}
/** End Input Element ================================== */


/** Header ==================================
 * Header tag of HTML5
 *
 * ==========================================*/
 .header {
    margin              : 0px;
    padding             : opx;
    background-color    : #353d53;
    color               : #F2F2F2;
    font-size           : 16px;
}

.header a {
    color: white;
}

.header a:HOVER {
    color: white;
}

.header .logo_left{
    margin        : 0px 0px 0px 0px;
    padding        : 0px 0px 0px 0px;
    border        : none;
    height        : 32px;
    behavior    : url(css/iepngfix.htc);
}

.header .menu_left{
    margin      : 4px 4px 4px 0px;
    width       : 50%;
    text-align  : left;
    float       : left;
}

.header .menu_left br {
    margin  : 0px;
    padding : 0px;
}

.header .menu_right{
    margin      : 4px 0px 4px 4px;
    padding     : 0px 0px 0px 0px;
    width       : 50%;
    text-align  : right;
    float       : right;
}

.header .icon-basket {
    font-size     : 40px;
    line-height   : 40px;
    margin-bottom : 8px;
}

.header .search_form {
    margin: 8px 0px;
    /*Hack IE 7*/
    *margin: 0px;
    *padding: 0px;
}

.header .button_search {
    margin              : 0px;
    padding             : 4px 8px;
    vertical-align      : middle;
    z-index             : 1;
    color               : black;
    font-size           : 24px;
    line-height         : 18px;
    float               : right;

    /*Hack IE 8,9,10*/
    line-height         : 16px\0;

    /*Hack IE 7*/
    *float              : none;
    *margin-left        : -6px;
    *height             : 16px;
    *line-height        : 16px;
    *vertical-align     : text-bottom;
    *padding            : 4px 12px 12px 12px;

    background-color    : #DBDBDB;
}

.header .text_search {
    margin  : 0px 0px 0px 0px;
    padding : 5px;
    height  : 16px;
    width   : 308px;
    border  : 3px solid #DBDBDB;
    color   : rgb(125, 125, 125);

    /*Hack IE 8,9,10*/
    border  : 3px solid #DBDBDB\0;
    /*Hack IE 7*/
    *border  : 3px solid #DBDBDB;
}
/** End Header ================================== */


/** body_content ============================
 * content section after header tag
 *
 * ==========================================*/
.body_content {
    background : white url(../../images/image_default/bg_body.gif) 0 0 repeat-x;
    z-index    : 0;
    padding    : 4px 0px;
}
/** End body_content ================================== */


/** nav_primary ============================
 * content section after header tag
 *
 * ==========================================*/
.nav_primary {
    z-index             : 1;
    margin-bottom       : 4px;
    *height             : 40px;

    background-color    : #f5f5f5;
    background-image    : -moz-linear-gradient(#f5f5f5, #f1f1f1);
    background-image    : -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#f1f1f1));
    background-image    : -webkit-linear-gradient(#f5f5f5, #f1f1f1);
    background-image    : -o-linear-gradient(#f5f5f5, #f1f1f1);
    background-image    : -ms-linear-gradient(#f5f5f5, #f1f1f1);
    background-image    : linear-gradient(#f5f5f5, #f1f1f1);
    filter              : progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#f5f5f5', EndColorStr='#f1f1f1');

    -webkit-box-shadow  : 0px 1px 4px 0px #4a4a4a;
    -moz-box-shadow     : 0px 1px 4px 0px #4a4a4a;
    -ms-box-shadow      : 0px 1px 4px 0px #4a4a4a;
    -o-box-shadow       : 0px 1px 4px 0px #4a4a4a;
    box-shadow          : 0px 1px 4px 0px #4a4a4a;
}
/** End nav_primary ================================== */


/** Footer ============================
 * Footer of website
 *
 * ==========================================*/
 footer {
    margin : 4px 0 0 0;
    width  : 100%;
 
    background-color    : #f5f5f5;
    background-image    : -moz-linear-gradient(#f5f5f5, #f1f1f1);
    background-image    : -webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#f1f1f1));
    background-image    : -webkit-linear-gradient(#f5f5f5, #f1f1f1);
    background-image    : -o-linear-gradient(#f5f5f5, #f1f1f1);
    background-image    : -ms-linear-gradient(#f5f5f5, #f1f1f1);
    background-image    : linear-gradient(#f5f5f5, #f1f1f1);
    filter              : progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#f5f5f5', EndColorStr='#f1f1f1');

    -webkit-box-shadow  : 0px -1px 4px 0px #4a4a4a;
    -moz-box-shadow     : 0px -1px 4px 0px #4a4a4a;
    -ms-box-shadow      : 0px -1px 4px 0px #4a4a4a;
    -o-box-shadow       : 0px -1px 4px 0px #4a4a4a;
    box-shadow          : 0px -1px 4px 0px #4a4a4a;
 }
 
footer .footer {
    margin : 4px 0px;
}

footer .footer_line{
    width           : 100%;
    display         : block;
    float           : left;
    margin          : 0px;
    padding         : 0px 0px 4px 0px;
    border-bottom   : 1px solid #CCCCCC;
}

footer .text_footer {
    width           : 100%;
    display         : block;
    float           : left;
    margin          : 0px;
    padding         : 4px 0px 0px 0px;
}

.text_footer a,
.logo_footer a {
    text-decoration : none;
    font-weight     : bold;
}

.footer .align_left {
    width   : 50%;
    float   : left;
    border  : none;
}

.footer .align_right {
    width   : 50%;
    float   : right;
    border  : none;
}
/** End Footer ================================== */


/**user_navigation =========================================================
* 
* This is class for control pannel of user
* Operations of user at web site will be display at this area
* =========================================================================
*/
ul.user_navigation {
    margin          : 0px;
    padding-left    : 0px;
    list-style-type : none;
    float           : right;
    z-index         : 101;
}

ul.user_navigation a {
    margin          : 0px 4px 0px 4px;
    color           : inherit;
    text-decoration : none;
    font-weight     : bold;
}

ul.user_navigation li,
ul.user_navigation li.li_pannel{
    padding     : 12px 12px;
    position    : relative;
    color       : #353d53;
    text-shadow : -1px 1px 0 #ccc;
}

ul.user_navigation li.li_input {
    padding     : 0px;
    padding-left: 4px;
}

ul.user_navigation li.li_pannel {
    margin-right: 4px;
    width       : auto;
    text-align  : left;
}

ul.user_navigation ul{
    margin          : 0px;
    padding         : 0px 0px;
    border-top      : none;
    position        : absolute;
    width           : auto;
    top             : 40px;
    left            : 0px;
    visibility      : hidden;
    list-style-type : none;
    z-index         : 101;
    background-color: white;
}

ul.user_navigation li li {
    padding         : 8px 7px;
    font-weight     : normal;
    width           : 150px;
    background-color: #f5f5f5;
}

ul.user_navigation li.li_pannel:HOVER {
    background-color    : #4D4D4D;
    color               : #fff;
    text-shadow         : -1px 1px 0 #ccc;

    -moz-transition     : 0.25s all;
    -webkit-transition  : 0.25s all;
    -o-transition       : 0.25s all;
    transition          : 0.25s all;
}

ul.user_navigation li.li_pannel:HOVER li {
    color       : #353d53;
    text-shadow : -1px 1px 0 #ccc;
}
ul.user_navigation li.li_pannel:HOVER li:HOVER {
    background-color: #4D4D4D;
    color           : #fff;
    text-shadow     : -1px 1px 0 #ccc;
}

ul.user_navigation li.li_pannel:HOVER ul {
    display     : block;
    visibility  : visible;
}
/** End user_navigation ================================== */


/*
 * galleries_item ============================================================
 * Display 4 Item (album, products) in row by horizon, vertical
 * Horizon
 *  ________                 _______                
 * |image    | Infomation    |image  | Infomation
 * |        | Infomation     |       | Infomation        
 * |________|                |_______|
 * Vertical
 *  ________     _______                
 * |image   |   |image |
 * |        |    |      |
 * |________|    |______|
 * Infomation    Infomation
 * Infomation    Infomation
 * ===========================================================================
 */
.galleries_item {
    float   : left;
    width   : 100%;
    _margin : 0px;
    
    /* Bo góc đường viền CSS3*/
    -webkit-border-radius : 4px 4px 4px 4px; /* Safari prototype */
    -moz-border-radius    : 4px 4px 4px 4px; /* Gecko browsers */
    border-radius         : 4px 4px 4px 4px; /* dùng cho các trình duyệt khác - Topleft TopRight BottomRight BottomLeft*/
    
    /*Hỗ trợ IE 6,7,8 nhận diện được CSS3*/    
    behavior: url(css/PIE.htc);
}

.galleries_item .row_item {
    float  : left;
    margin : 4px 0px 4px 0px;
    width  : 100%;
    
}

.galleries_item .item_title {
    width       : 100%;
    display     : block;
    font-weight : bold;
    
    white-space : -moz-pre-wrap !important;  /* Mozilla, since 1999 */
    white-space : -pre-wrap;/* Opera 4-6 */
    white-space : -o-pre-wrap;/* Opera 7 */
    white-space : pre-wrap;/* css-3 */
    word-wrap   : break-word;/* Internet Explorer 5.5+ */
    word-break  : break-word;
}

.galleries_item .item_sub_title {
    color : #FF6314;
}

.galleries_item .butt_icon {
    margin     : 0px;
    padding    : 0px;
    display    : block;
    margin-top : 4px;
}

.galleries_item .item_vertical,
.galleries_item .item_horizon {
    float   : left;
    margin  : 4px 4px 4px 4px;
    padding : 0px;
    width   : 168px;
    _margin : 0px 3px;
}

.galleries_item .item_vertical .item_content,
.galleries_item .item_horizon .item_content {
    padding : 4px;
    float   : left;
    width   : 95%; 
}

.galleries_item .icon_cart {
    position     : absolute;
    top          : 0px;
    right        : 4px;
    display      : block!important;
    width        : 0px!important;
    height       : 40px!important;
    padding-left : 44px!important;
    cursor       : pointer;
    background   : url('../../images/image_default/add_cart_blue.png') no-repeat left;
    
    behavior     : url(css/iepngfix.htc);
}

.galleries_item .item_vertical:HOVER .item_content,
.galleries_item .item_horizon:HOVER .item_content {
    padding          : 3px;
    border           : 1px solid #0C9FD4;
    background-color : #EAFFE0;
    width            : 95%; 
}

.galleries_item .item_vertical img,
.galleries_item .item_horizon img {
    margin-bottom : 4px;
    border        : 1px solid #353d53;
    padding       : 3px 3px 3px 3px;
    
    /* Bo góc đường viền CSS3*/
    -webkit-border-radius : 4px 4px 4px 4px; /* Safari prototype */
    -moz-border-radius    : 4px 4px 4px 4px; /* Gecko browsers */
    border-radius         : 4px 4px 4px 4px; /* dùng cho các trình duyệt khác - Topleft TopRight BottomRight BottomLeft*/
    
    /*Đổ bóng cho khung viền*/
    -moz-box-shadow    : 2px 2px 1px #ADDEFF;
    -webkit-box-shadow : 2px 2px 1px #ADDEFF;
    box-shadow         : 2px 2px 1px #ADDEFF;
    
    /*Hỗ trợ IE 6,7,8 nhận diện được CSS3*/    
    behavior : url(css/PIE.htc);
}

.galleries_item .item_vertical img {
    width          : 93%;
    height         : inherit;
    vertical-align : bottom;
}

.galleries_item .item_horizon img {
    margin-right  : 4px;
    margin-bottom : 0px;
    float         : left;
}

.galleries_item .item_horizon span {
    display : block;
}
/** End galleries_item ================================== */


/**
 * item_detail ==============================================================
 * Show short infomation of artist
 * _________
 * |        | name      : name
 * |image   | company   : company
 * |________| long description at
 * here, now you can imagine (^_^)
 * ==========================================================================
 */
.item_detail {
    margin       : 4px;
    width        : auto;
    _margin-left : 0px;
    text-align   : justify;
    float        : left;
}

.item_detail .link_navigation {
    margin : 4px 4px;
    width  : auto;
}

.item_detail .image_item {
    height         : 160px;
    margin-right   : 8px;
    vertical-align : top;
    float          : left;
    padding        : 3px;
    border         : 1px solid #0C9FD4; 
}

.item_detail .tb_info {
    width : auto;
}

.item_detail .tb_info th,
.item_detail .tb_info td,
.item_detail .tb_info th:HOVER,
.item_detail .tb_info td:HOVER {
    border : none;
    background-color: white;
}

.item_detail .combobox {
    font-size   : 12px;
    line-height : 16px;
    margin      : 0px;
    padding     : 3px;
    height      : 24px;
    width       : 140px;
    border      : 1px solid #0C9FD4;
}

.item_detail .textbox {
    font-size   : 12px;
    line-height : 16px;
    margin      : 0px;
    padding     : 3px;
    width       : 52px;
    border      : 1px solid #0C9FD4;
}

.item_detail .tab_menu {
    margin-left     : 0px;
    margin-right    : 0px;
}
/** End item_detail ================================== */


/**
 * small properties =========================================================
 * Small properties with important label
 *
 * ==========================================================================
 */
.right_text {
    text-align : right !important;
}

.margin_top_4 {
    margin-top : 4px !important;
}

.margin_bottom_4 {
    margin-bottom : 4px !important;
}
/** End small properties ================================== */


/**
 * Class Name: header_ribbon ===================================================
 * Make an header of box with full background color and 
 * the gab between it and border of box is 3
 * Ex: ([++++++++ Title ++++++++++])
 * ===========================================================================
 */
.header_ribbon {
    position      : relative;
    margin-bottom : 16px;
    float         : left;
    width         : 104%;
}

.header_ribbon .ribbon {
    font-size          : 14px;
    font-weight        : bold;
    color              : white;
    text-shadow        : -1px 1px 0 #5B5B5B;
    padding            : 8px 0px;
    z-index            : 2;

    background         : #e74c32;
    background-image   : url('../../images/image_default/bg_noise.png');
    position           : relative;
    left               : -5px;
    top                : 13px;

    -moz-box-shadow    : 0px 0px 4px rgba(0,0,0,0.55);
    -khtml-box-shadow  : 0px 0px 4px rgba(0,0,0,0.55);
    -webkit-box-shadow : 0px 0px 4px rgba(0, 0, 0, 0.55);
}

.header_ribbon .ribbon label {
    padding-left : 8px;
}

.header_ribbon .triangle-l {
    border-color : transparent #004466 transparent transparent;
    border-style : solid;
    border-width : 5px;
    height       : 0px;
    width        : 0px;
    position     : absolute;
    left         : -9px;
    top          : 40px;
    z-index      : 0;
}

.triangle-r {
    border-color : transparent transparent transparent #004466;
    border-style : solid;
    border-width : 5px;
    height       : 0px;
    width        : 0px;
    position     : absolute;
    right        : 0px;
    top          : 40px;
    z-index      : 0;
}
/** End header_ribbon ================================== */


/**
 * box ==============================================================
 * container of contain with background-color is white
 *
 * ==================================================================
 */
.box 
{
    margin              : 4px 0px;
    display             : block;
    float               : left;
    position            : relative;
    z-index             : 0;
    background-color    : White;
    border              : 1px solid #dddddd;

    -webkit-box-shadow : 0px 0px 8px rgba(0,0,0,0.3);
    -moz-box-shadow    : 0px 0px 8px rgba(0,0,0,0.3);
    -ms-box-shadow     : 0px 0px 8px rgba(0,0,0,0.3);
    -o-box-shadow      : 0px 0px 8px rgba(0,0,0,0.3);
    box-shadow         : 0px 0px 8px rgba(0,0,0,0.3);
    filter             : progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=0,enabled=true,strength=4),
                         progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=90,enabled=true,strength=4),
                         progid:DXImageTransform.Microsoft.Shadow(color=#cccccc,direction=180,enabled=true,strength=4),
                         progid:DXImageTransform.Microsoft.Shadow(color=#dddddd,direction=270,enabled=true,strength=4);
}

.box h1 {
    
    font-size        : 14px;
    font-weight      : bold;
    color            : white;
    text-shadow      : -1px 1px 0 #5B5B5B;
    padding          : 8px;
    margin           : 12px 0px 8px 0px;
    
    background       : #e74c32;
    background-image : url('../../images/image_default/bg_noise.png');
    color            : white;
    width            : 90%;
    
    /* ---------------------Bo góc đường viền CSS3--------------------------------*/
    -webkit-border-radius : 0px 4px 4px 0px; /* Safari prototype */
    -moz-border-radius    : 0px 4px 4px 0px; /* Gecko browsers */
    border-radius         : 0px 4px 4px 0px; /* dùng cho các trình duyệt khác - Topleft TopRight BottomRight BottomLeft*/
    
    /* ---------------------Đổ bóng cho element CSS3--------------------------------*/
    -moz-box-shadow    : 1px 2px 4px rgba(0,0,0,0.4);
    -khtml-box-shadow  : 1px 2px 4px rgba(0,0,0,0.4);
    -webkit-box-shadow : 1px 2px 4px rgba(0, 0, 0, 0.4);
    
    /*Hỗ trợ IE 6,7,8 nhận diện được CSS3*/
    behavior: url(css/PIE.htc);
}

.box p {
    width   : auto;
    padding : 4px 4px;
}

.box_menu p:HOVER{
    background-color : #EFEFEF;
}

.box .box_inside {
    float   : left;
    margin  : 4px;
    border  : 1px solid #353d53;
    width   : 98.7%;

    /* ---------------------Bo góc đường viền CSS3--------------------------------*/
    -webkit-border-radius : 8px 8px 8px 8px; /* Safari prototype */
    -moz-border-radius    : 8px 8px 8px 8px; /* Gecko browsers */
    border-radius         : 8px 8px 8px 8px; /* dùng cho các trình duyệt khác - Topleft TopRight BottomRight BottomLeft*/
}
/** End box ================================== */


/**
 * box_end ==============================================================
 * Add some text (link, description) into the right of bottom of box
 * Ex: "search more>>"
 * =========================================================================
 */
.box_end {
    float         : right;
    font-weight   : bold;
    margin-bottom : 4px;
    margin-right  : 4px;
}
/** End box_end ================================== */


/**
 * box_paging ==============================================================
 * Make a list of number of page, gab between number is 4px
 * Ex: [<]... [1] [2] ...[>]
 * =========================================================================
*/
.box_paging {
    margin        : 4px 0px;
    float         : left;
    margin-bottom : 4px;
    width         : 100%;
    text-align    : center;
}
        
.box_paging a {
    color           : #006699;
    font-weight     : bold;
    text-decoration : none;
    border          : 1px solid #006699;
    padding         : 1px 3px;

    /*Hack IE 7*/
    *line-height     : 20px;
}

.box_paging .selected_page,
.box_paging .selected_page a {
    background-color : #469cb4;
    color            : white;
    font-weight      : bolder;
}

.box_paging a:HOVER {
    background-color : #387c8f;
    color            : white;
    font-weight      : bolder;
}
/** End box_paging ================================== */


/**
 * tab_menu ====================================================
 * Style of input, select in header of area
 *       ____   ____   ____
 * Ex: _|    |_|    |_|    |______
 * here, now you can imagine (^_^)
 * ===========================================================================
 */
.tab_menu {
    font-size    : 12px;
    font-weight  : bold;
    float        : left;
    margin       : 4px;

    border-width : 0px 0px 1px 0px;
    border-style : solid;
    border-color : #0C9FD4;
}

.tab_menu .tab_control {
    width            : auto;
    margin           : 0px 4px;
    margin-bottom    : -1px;
    padding          : 4px;
    float            : left;
    display          : inline;
    cursor           : pointer;
    border-width     : 1px 1px 0px 1px;
    border-style     : solid;
    border-color     : #0C9FD4;
    background-color : #0C9FD4;
    color            : white;
}

.tab_menu .tab_control:HOVER,
.tab_menu .tab_selected {
    border-bottom    : none;
    background-color : #FAFEFF;
    color            : #006699;
}
/** End tab_menu ================================== */


/**
 * tb_general ======================================================
 * Style table for website, this style is general, it's for all page
 * =================================================================
 */
table.tb_general {
    padding         : 0px;
    border-collapse : collapse;
    width           : 100%;
    margin          : 4px 0px;
}

table.tb_general tr {
    margin         : 0px;
    padding        : 0px;
    vertical-align : top;
}

table.tb_general tr:HOVER {
    background-color: #EFEFEF;
}

table.tb_general th {
    margin           : 0px;
    padding          : 4px 4px 3px 4px;
    line-height      : 16px;
    text-align       : left;
    vertical-align   : middle;
    border-bottom    : 1px solid #CECECE;
    background-color : #EFEFEF;
}

table.tb_general td {
    margin         : 0px;
    padding        : 4px 4px 3px 4px;
    line-height    : 16px;
    vertical-align : top;
    border-bottom  : 1px solid #CECECE;
}

table.tb_general span.title {
    float        : left;
    margin-right : 12px;
}

table.tb_general td.td_button {
    border-bottom : none;
    padding       : 4px 4px 4px 4px;
    text-align    : center;
}

table.tb_general td.td_last,
table.tb_general th.td_last {
    border-bottom : none;
    padding       : 4px 4px 4px 4px;
}
/** End tb_general ================================== */


/*
 * form_input ============================================================
 * Display a form to submit request of user
 *                _______________
 * lable:        |_______________|
 *                _______________
 * lable:        |_______________|
 *                __________
 *               |__submit__|
 * ===========================================================================
 */
.form_input {
     margin : 4px 0px;
}
 
.form_input fieldset {
    margin  : 0px 4px;
    padding : 0px;
    border  : none;
}

.form_input .form_input_row {
    margin         : 4px;
    float          : left;
    position       : relative;
    width          : 99%;
    padding-bottom : 3px;
    border-bottom  : 1px solid #CCC;
}

.form_input .form_input_row img{
    border: none;
}

.form_input .form_input_row .label_title {
    font-weight    : bolder;
    vertical-align : middle;
    position       : absolute;
    top            : 4px;
    left           : 0px;
    width          : 22%;
}

.form_input .form_input_row .lable_validation {
    margin  : 0px;
    padding : 4px;
    float   : right;
    color   : red;
    display : none;
    width   : 75%;
}

.form_input .form_input_row .form_textbox,
.form_input .form_input_row .form_textarea,
.form_input .form_input_row .form_combobox {
    float  : right;
    resize : vertical;
    width  : 75%;
}

.form_input .form_input_row .form_combobox {
    width : 75.8%;
}

.form_input .form_input_row .input_items_horizon {
    margin         : 0px;
    padding        : 0px;
    float          : right;
    padding-top    : 4px;
    vertical-align : top;
    width          : 76%;
    *width         : 76.8%;
}

.form_input .form_input_row .input_items_horizon input {
    vertical-align : top;
    float          : left;
    margin-right   : 8px;
}

.form_input .form_input_row .input_items_horizon label {
    float  : left;
    margin : 0px 8px 0px 0px;
}

.form_input .form_input_row .input_button {
    width       : 32%;
    font-weight : bolder;
}
/** End form_input ================================== */


/**
 * dialog_message ====================================================
 * Popup box for comand, submit,...
 * ===========================================================================
 */
.dialog_message {
    margin  : 0px;
    padding : 0px;
}

.dialog_message p.center {
    margin     : 0px;
    padding    : 0px;
    text-align : center;
}
/** End dialog_message ================================== */


/**
 * Class Name: header_full ===================================================
 * Make an header of box with full background color and 
 * the gab between it and border of box is 3
 * Ex: ([++++++++ Title ++++++++++])
 * ===========================================================================
 */
.header_full {
    width                 : auto;
    margin                : 2px;
    padding               : 8px;/*Top Right Bottom Left*/
    font-weight           : bold;
    /*border-width          : 8px;*/
    color                 : white;
    text-shadow           : -1px 1px 0 #5b5b5b;

    background            : #e74c32;
    /*background-image      : url('../../images/image_default/bg_noise.png');
    -webkit-border-image  : url('../../images/image_default/bg_stitch.png') 8 repeat; 
    -moz-border-image     : url('../../images/image_default/bg_stitch.png') 8 repeat;
    -o-border-image       : url('../../images/image_default/bg_stitch.png') 8 repeat;
    border-image          : url('../../images/image_default/bg_stitch.png') 8 repeat;*/

    -webkit-border-radius : 8px 8px 8px 8px;
    -moz-border-radius    : 8px 8px 8px 8px;
    border-radius         : 8px 8px 8px 8px;
    behavior              : url(css/PIE.htc);
}
/** End header_full ================================== */


/**
 * form_header ====================================================
 * Style of input, select in header of area
 * ================================================================
 */
.form_header {
    margin           : 3px;
    margin-bottom    : 4px;
    padding          : 0px;
    float            : none;
    text-align       : center;
    background-color : #0C9FD4;
}

.form_header form {
    padding        : 4px 0px;
    *margin-bottom : 0px;
}

.form_header label {
    color : white;
}

.form_header input,
.form_header select {
    margin  : 0px;
    border  : 1px solid;
    padding : 3px 3px;
    height  : 16px;
}

.form_header select {
    border-top : 0px;
    height     : 24px;
}

.form_header .button {
    height : 24px;
}
/** End form_header ================================== */


/*
 * music_list ====================================================
 * Show list of music like below 
 *  ________
 * |image    | Tilte            description        [button][button]
 * |optional| Artist        some things        
 * |________| Some things
 * ===========================================================================
 */
.music_list {
    margin  : 0px 3px 0px 3px;
    *margin : 0px 3px 0px 3px;
    float   : left;
    _margin : 0px;
}
 
.music_list .item {
    padding       : 4px 4px 3px 4px;
    position      : relative;
    border-bottom : 1px solid #CCC;
    float         : left;
    width         : 100%;
}

.music_list .item .image_thumbail,
.music_list .item .image_album {
    float        : left;
    margin-right : 8px;
    width        : 120px;
    height       : 88px;
    border       : 1px solid #CCCCCC;
    padding      : 3px 3px 3px 3px;

    /* Bo góc đường viền CSS3*/
    -webkit-border-radius : 4px 4px 4px 4px; /* Safari prototype */
    -moz-border-radius    : 4px 4px 4px 4px; /* Gecko browsers */
    border-radius         : 4px 4px 4px 4px; /* dùng cho các trình duyệt khác - Topleft TopRight BottomRight BottomLeft*/

    /*Hỗ trợ IE 6,7,8 nhận diện được CSS3*/    
    behavior: url(css/PIE.htc);
}

.music_list .item .image_album {
    height : 120px;
}

.music_list .item .info {
    float : left;
}

.music_list .item .desc {
    float         : right;
    margin-right  : 80px;
    _margin-right : 44px;
}

.music_list .item .title {
    font-size   : 12px;
    line-height : 17px;
    color       : #313131;
    font-weight : bold;
    margin      : 0px 0px 0px 0px; 
}

.music_list .item p {
    margin : 0px 0px 0px 0px;
}

.music_list .item .column_center {
    float : left;
}

.music_list .item .button{
    position : absolute!important;
    right    : 4px;
    top      : 4px;
}
/** End music_list ================================== */


/* media_player ==============================================================
 * Display music player to play media file 
 * ===========================================================================
 */
.media_player {
    margin            : 7px 7px 0px 7px;
    float            : left;
}
/** End media_player ================================== */


/*
 * media_list ================================================================
 * Display music list of album, music, playlist to play
 * | Title        | Artist        |     button|
 * | Title        | Artist        |     button|
 * =========================================================================== 
 */
.media_list {
    float      : left;
    margin     : 4px 7px;
    margin-top : 0px;
    overflow-y : auto;
    overflow-x : hidden;
}

.media_list ul.list_item {
    float      : left;
    margin     : 0px;
    padding    : 0px;
    overflow-y : scroll;
    overflow-x : hidden;
    max-height : 180px;
}

.media_list ul.list_item li {
    text-decoration  : none;
    list-style-type  : none;
    list-style-image : none;
    float            : left;
    margin           : 0px 0px 0px 0px;
    background-color : #F6F6F6;
}

.media_list ul.list_item li:HOVER {
    background-color : transparent;
    color            : #08C;
}

.media_list ul.list_item .item_title,
.media_list ul.list_item .item_artist,
.media_list ul.list_item .button_nav {
    float         : left;
    padding       : 7px 3px 7px 0px;
    border-right  : 1px solid #D7D7D7;
    border-bottom : 1px solid #D7D7D7;
}

.media_list ul.list_item .item_title {
    text-align   : left;
    padding-left : 8px;
}

.media_list ul.list_item .item_artist {
    padding-left : 8px;
}

.media_list ul.list_item .button_nav {
    float      : right;
    text-align : right;
    height     : 17px;
}
/** End media_list ================================== */

    
    
/*
 * horizon line ============================================================
 * Display a line under object, paragraph
 *     ___________________
 * 
 * ===========================================================================
 */
.underline {
    margin    : 4px 0px 8px 0px;
    border    : 2px inset;
    width    : 92%; 
}
